<template>
	<view>
		<view class="user-section">
			<image class="bg" src="/static/images/user-bg.jpg"></image>
		</view>
		<view class="user-info-box">
		<view class="portrait-box" @click="dian">
			<image class="portrait" :src="`/gongyi/common/download?name=${this.user.avatar}`"></image>
		</view>
		<view class="nic">昵称：<text>{{this.user.username}}</text></view>
		</view>
		<view class="list-card">
			<view class="card">
			  <view class="item item-bottom-solid">
			    <view class="left flex-center">
			      <image src="/static/2.png" mode="aspectFit"></image>
			    </view>
			    <view class="center" @click="dian">
			      <text>个人中心</text>
			    </view>
			    <view class="right flex-center">
			      <u-icon class="icon" name="arrow-right"></u-icon>
			    </view>
			  </view>
			</view>
		
		  <view class="card">
		    <view class="item item-bottom-solid">
		      <view class="left flex-center">
		        <image src="/static/2.png" mode="aspectFit"></image>
		      </view>
		      <view class="center">
		        <text>积分</text>
				<text class="nid">{{this.user.point}}</text>
		      </view>
		      <view class="right flex-center">
		        <u-icon class="icon" name="arrow-right"></u-icon>
		      </view>
		    </view>
		  </view>
		  <view class="card">
		    <view class="item item-bottom-solid">
		      <view class="left flex-center">
		        <image src="/static/2.png" mode="aspectFit"></image>
		      </view>
		      <view class="center" @click="joinActivity">
		        <text>参加的活动</text>
		      </view>
		      <view class="right flex-center">
		        <u-icon class="icon" name="arrow-right"></u-icon>
		      </view>
		    </view>
		  </view>
		  <view class="card">
		    <view class="item item-bottom-solid">
		      <view class="left flex-center">
		        <image src="/static/2.png" mode="aspectFit"></image>
		      </view>
		      <view class="center" @click="goMyPub">
		        <text>发布的活动</text>
		      </view>
		      <view class="right flex-center">
		        <u-icon class="icon" name="arrow-right"></u-icon>
		      </view>
		    </view>
		  </view>
          <view class="card">
            <view class="item item-bottom-solid">
              <view class="left flex-center">
                <image src="/static/2.png" mode="aspectFit"></image>
              </view>
              <view class="center" @click="goMyAvail">
                <text>我的闲置</text>
              </view>
              <view class="right flex-center">
                <u-icon class="icon" name="arrow-right"></u-icon>
              </view>
            </view>
          </view>
		  <view class="card" v-if="user.username != 'cheat' ">
		    <view class="item item-bottom-solid">
		      <view class="left flex-center">
		        <image src="/static/2.png" mode="aspectFit"></image>
		      </view>
		      <view class="center"  @click="toChatHappy">
		        <text>心理咨询</text>
		      </view>
		      <view class="right flex-center">
		        <u-icon class="icon" name="arrow-right"></u-icon>
		      </view>
		    </view>
		  </view>
		  <view class="card" v-if="user.username != 'happy' ">
		    <view class="item item-bottom-solid">
		      <view class="left flex-center">
		        <image src="/static/2.png" mode="aspectFit"></image>
		      </view>
		      <view class="center"  @click="toChatCheat">
		        <text>防诈骗咨询</text>
		      </view>
		      <view class="right flex-center">
		        <u-icon class="icon" name="arrow-right"></u-icon>
		      </view>
		    </view>
		  </view>
		  <view class="card">
		    <view class="item item-bottom-solid">
		      <view class="left flex-center">
		        <image src="/static/qiu.png" mode="aspectFit"></image>
		      </view>
		      <view class="center" @click="aaa">
		        <text>设置</text>
		      </view>
		      <view class="right flex-center">
		        <u-icon class="icon" name="arrow-right"></u-icon>
		      </view>
		    </view>
		  </view>
		  <view class="card">
		    <view class="item item-bottom-solid">
		      <view class="left flex-center">
		        <image src="/static/2.png" mode="aspectFit"></image>
		      </view>
		      <view class="center" @click="arr">
		        <text>帮助中心</text>
		      </view>
		      <view class="right flex-center">
		        <u-icon class="icon" name="arrow-right"></u-icon>
		      </view>
		    </view>
		  </view>
		</view>
		 <view class="quit flex-center">
		    <view class="btn flex-center" @click="quit()">
		      退出登录
		    </view>
		 </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user:{},
			};
		},
        onShow() {
            console.log("in");
            this.user = uni.getStorageSync("user");
            console.log(this.user.id);
            uni.request({
                url:'/gongyi/user/selectUserById?id='+this.user.id,
                method:'GET',
                success: (res) => {
                    // console.log("inmethod",res.data.user);
                    uni.setStorageSync("user", res.data.user);
                    this.user = res.data.user;
                }
            });
        },
		methods:{
			quit(){
				uni.navigateTo({
				    url:'/pages/login/login'
				}) 
			},
            joinActivity(){
                uni.navigateTo({
                    url:'/pages/my/joinedactivity/joinactivity'
                }) 
            },
			dian(){
				uni.navigateTo({
					url:"/pages/my/mycenter/mycenter"
				})
			},
			aaa(){
				uni.navigateTo({
					url:"/pages/my/set/set"
				})
			},
			arr(){
				uni.navigateTo({
					url:"/pages/my/helpcenter/helpcenter"
				})
			},
			toChatCheat(){
				uni.navigateTo({
					url:"/pages/chatroom/chatCheat"
				})
			},
			toChatHappy(){
				uni.navigateTo({
					url:"/pages/chatroom/chatHappy"
				})
			},
            goMyPub(){
                uni.navigateTo({
                    url:"/pages/my/myPub/myPub"
                })
            },
            goMyAvail(){
                uni.navigateTo({
                    url:"/pages/my/mySecond/mySecond"
                })
            }
		}
	}
</script>

<style lang="scss">
	.user-section{
		height: 250rpx;
		padding: 100rpx 30rpx 0;
		position:relative;
		.bg{
			position:absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			filter: blur(1px);
			opacity: .7;
		}
	}
	.user-info-box{
		height: 10rpx;
		display:flex;
		align-items:center;
		position:relative;
		z-index: 1;
		.portrait{
			width: 130upx;
			height: 130upx;
			border:5upx solid #fff;
			border-radius: 50%;
		}
}
.nic{
	float: right;
	padding: 40rpx 30rpx;
	margin-top: 20rpx;
	font-size: 35rpx;
	color: #4f99ff;
}
.list-card {
  padding: 0 15px;
  margin-top: 30rpx;
  .card {
    border-radius: 5px;
    position: relative;
    background-color: white;
    border-radius: 5px;
    padding: 5px 30px;
    .item {
      display: flex;
      height: 120rpx;
      .left {
        width: 15%;
        image {
          width: 70rpx;
          height: 70rpx;
        }
      }
      .center {
        width: 80%;
        display: flex;
        justify-content: start;
        align-items: center;
        font-size: 1.1em;
      }
	
      .right {
        width: 20%;
        justify-content: flex-end;
      }
    }
  }
}
.item-bottom-solid {
  border-bottom: 1px solid #d4d6da;
}
.quit{
  height: 100rpx;
  margin-top: 50px;
  .btn{
    background-color: #4f99ff;
    border-radius: 30px;
    width: 80%;
    color: white;
    font-size: 1.2em;
    height: 100%;
  }
}
.flex-center{
  display: flex;
  justify-content: center;
  align-items: center;
}
  .nid{
	    float: right;
		margin-left: 320rpx;
	  }

</style>
